{% extends 'homepage/index.html' %}
{% load staticfiles %}
{% block page %}
  <header>
    <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
      <ol class="carousel-indicators">
        <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
        <li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
        <li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
      </ol>
      <div class="carousel-inner" role="listbox">
        <!-- Slide One - Set the background image for this slide in the line below -->
        <div class="carousel-item active"
             style="background-image: url('{% static 'img/Xrnqkx9MFqBn-bm7pB2iUgz6-cKA_dlYfNMLAnzTCwI.jpeg' %}')">
          <div class="carousel-caption d-none d-md-block">
            <h3>HLG如淇玩城手工香皂</h3>
            <p>HLG如淇玩城手工香皂HLG如淇玩城手工香皂</p>
          </div>
        </div>
        <!-- Slide Two - Set the background image for this slide in the line below -->
        <div class="carousel-item" style="background-image: url('{% static 'img/maxresdefault.jpg' %}')">
          <div class="carousel-caption d-none d-md-block">
            <h3>HLG如淇玩城手工香皂</h3>
            <p>HLG如淇玩城手工香皂HLG如淇玩城手工香皂</p>
          </div>
        </div>
        <!-- Slide Three - Set the background image for this slide in the line below -->
        <div class="carousel-item"
             style="background-image: url('{% static 'img/ZGszUIKFvTMxbPkkvOcQkHwF7ctqSf558dtN3fHbTd0.jpeg' %}')">
          <div class="carousel-caption d-none d-md-block">
            <h3>HLG如淇玩城手工香皂</h3>
            <p>HLG如淇玩城手工香皂HLG如淇玩城手工香皂</p>
          </div>
        </div>
      </div>
      <a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
        <span class="carousel-control-prev-icon" aria-hidden="true"></span>
        <span class="sr-only">Previous</span>
      </a>
      <a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
        <span class="carousel-control-next-icon" aria-hidden="true"></span>
        <span class="sr-only">Next</span>
      </a>
    </div>
  </header>
  <!-- Page Content -->
  <div class="container">

    <h1 class="my-4">欢迎来到如淇玩城</h1>

    <!-- Marketing Icons Section -->
    <div class="row">
      <div class="col-lg-4 mb-4">
        <div class="card h-100">
          <h4 class="card-header">产品系列1</h4>
          <div class="card-body">
            <p class="card-text">介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍</p>
          </div>
          <div class="card-footer">
            <a href="#" class="btn btn-primary">查看更多</a>
          </div>
        </div>
      </div>
      <div class="col-lg-4 mb-4">
        <div class="card h-100">
          <h4 class="card-header">产品系列2</h4>
          <div class="card-body">
            <p class="card-text">介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍</p>
          </div>
          <div class="card-footer">
            <a href="#" class="btn btn-primary">查看更多</a>
          </div>
        </div>
      </div>
      <div class="col-lg-4 mb-4">
        <div class="card h-100">
          <h4 class="card-header">产品系列3</h4>
          <div class="card-body">
            <p class="card-text">介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍</p>
          </div>
          <div class="card-footer">
            <a href="#" class="btn btn-primary">查看更多</a>
          </div>
        </div>
      </div>
    </div>
    <!-- /.row -->

    <!-- Portfolio Section -->
    <h2>商品展示</h2>

    <div class="row">
      <div class="col-lg-4 col-sm-6 portfolio-item">
        <div class="card h-100">
          <a href="#"><img class="card-img-top" src="{% static 'img/1.jpg' %}" alt=""></a>
          <div class="card-body">
            <h4 class="card-title">
              <a href="#">HLG如淇玩城手工香皂(马)</a>
            </h4>
            <p class="card-text">介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍</p>
          </div>
        </div>
      </div>
      <div class="col-lg-4 col-sm-6 portfolio-item">
        <div class="card h-100">
          <a href="#"><img class="card-img-top" src="{% static 'img/2.jpg' %}" alt=""></a>
          <div class="card-body">
            <h4 class="card-title">
              <a href="#">HLG如淇玩城手工香皂(吉)</a>
            </h4>
            <p class="card-text">介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍</p>
          </div>
        </div>
      </div>
      <div class="col-lg-4 col-sm-6 portfolio-item">
        <div class="card h-100">
          <a href="#"><img class="card-img-top" src="{% static 'img/3.jpg' %}" alt=""></a>
          <div class="card-body">
            <h4 class="card-title">
              <a href="#">HLG如淇玩城手工香皂(福)</a>
            </h4>
            <p class="card-text">介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍</p>
          </div>
        </div>
      </div>
      <div class="col-lg-4 col-sm-6 portfolio-item">
        <div class="card h-100">
          <a href="#"><img class="card-img-top" src="{% static 'img/4.jpg' %}" alt=""></a>
          <div class="card-body">
            <h4 class="card-title">
              <a href="#">HLG如淇玩城手工香皂(心)</a>
            </h4>
            <p class="card-text">介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍</p>
          </div>
        </div>
      </div>
      <div class="col-lg-4 col-sm-6 portfolio-item">
        <div class="card h-100">
          <a href="#"><img class="card-img-top" src="{% static 'img/5.jpg' %}" alt=""></a>
          <div class="card-body">
            <h4 class="card-title">
              <a href="#">HLG如淇玩城手工香皂(红)</a>
            </h4>
            <p class="card-text">介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍</p>
          </div>
        </div>
      </div>
      <div class="col-lg-4 col-sm-6 portfolio-item">
        <div class="card h-100">
          <a href="#"><img class="card-img-top" src="{% static 'img/6.jpg' %}" alt=""></a>
          <div class="card-body">
            <h4 class="card-title">
              <a href="#">HLG如淇玩城手工香皂(明)</a>
            </h4>
            <p class="card-text">介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍</p>
          </div>
        </div>
      </div>
    </div>
    <!-- /.row -->

    <!-- Features Section -->
    <div class="row">
      <div class="col-lg-6">
        <h2>如淇玩城</h2>
        <p>如淇玩城如淇玩城如淇玩城如淇玩城如淇玩城如淇玩城如淇玩城</p>
        <ul>
          <li>
            <strong>介绍1</strong>
          </li>
          <li>介绍2</li>
          <li>介绍3</li>
          <li>介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍</li>
          <li>介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍</li>
        </ul>
        <p>介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍</p>
      </div>
      <div class="col-lg-6">
        <img class="img-fluid rounded" src="{% static 'img/700x450.jpg' %}" alt="">
      </div>
    </div>
    <!-- /.row -->

    <hr>

  </div>
  <!-- /.container -->

{% endblock %}

